草庐IT

css - 用CSS分隔两个div

全部标签

javascript - Ajax 响应后无法重新触发 CSS 3 动画

这是一个HTML表单:Username:Password:这里是调用的JavaScript函数的相关代码if(xmlhttp.readyState==4&&xmlhttp.status==200){if(xmlhttp.responseText)document.getElementById("loginForm").submit()else{document.getElementById("report").style.webkitAnimationName="";setTimeout(function(){document.getElementById("report").styl

javascript - 移动设备上的 100% 高度和 CSS

我敢肯定这个问题以前有人问过,但我找不到任何非常相似的东西(有些问题略有相似)移动浏览器的趋势是在您向下滚动时隐藏地址栏,这很好,但对于严重依赖基于百分比的元素高度的网站来说存在问题,例如我现在制作的响应式网站。问题是,视口(viewport)大小会根据地址栏的可见性而变化。意思是,地址栏不可见时的100%高度大于其可见时的大小。当您滚动时,这会导致网站重新配置不稳定。这在移动版GoogleChrome上尤其成问题,因为每当您在页面中的任何位置向上滚动时,地址栏都会返回。大量不稳定的重新配置。我希望100%在没有地址栏的浏览器中表示100%。无论我采取什么解决方案,它都需要一些Java

javascript - 3D CSS 变换 : translateZ causes elements to disappear in Chrome

我正在使用Javascript在Chrome中操作CSS转换,我注意到当translateZ值变得太低(很远)时,元素将会消失。这似乎只有在有大量元素时才会发生。这似乎与元素的z-index有关。这是问题的一个例子:http://jsbin.com/iZAYaRI/26/edit将鼠标悬停在输出上以查看问题。有人知道为什么会这样吗?更新:看起来该元素并没有真正消失,而是移动了一千个像素左右。 最佳答案 在我的例子中,z平移属性大约为零。将我的零翻译从0更改为1解决了我的问题。在safari中运行的原始代码:transform:sca

javascript - 获取两个javascript对象的增量

我有两个大的嵌套javascript对象,我想比较它们并创建一个仅表示差异的对象。我打算用它来创建PATCH请求。给定oldObj和newObj:仅在newObj上的属性应该在diff中仅在oldObj上的属性应该在diff中如果值是数组、字符串或数字,则两个对象上的属性都应使用newObj中的值应该递归比较对象无需花哨合并数组,完全替换即可这看起来像是重复的,但我认为不是。Thissolution(1)只有一层深(下面的答案是非递归的,在数组上爆炸,并且不是双向的)。thissolution(2)返回未更改的属性不是双向的。目标输入/输出:diff({a:1},{a:0});//{a

javascript - 如何使同步两个 Divs 滚动位置更平滑

我正在尝试同步两个可滚动的DIVS滚动位置。遵循的方法:Method-1:on-scroll事件设置其他DIV的scrollTop。问题:滚动事件最后执行,UI在iOSSafari中缓慢。Method-2:使用setInterval来同步两个滚动位置。问题:iOS在滚动期间不执行定时器功能,所以滚动位置在最后同步。同样,这更加缓慢。尝试过,许多博客中提到的计时器已修复,但仍然没有优雅。Method-3:尝试自定义滚动条,所以iScroll并尝试在scroll事件上同步两者,问题:这看起来好多了,但在iOS中仍然很慢!!!Method-4:尝试自定义滚动条,所以iScroll并尝试在sc

javascript - 如何通过 url 重写在 Web 元素中正确缩小/合并 CSS/JS

我已经努力了好几个小时,试图设置真正重写url的适当缩小。我用过useref和usemin,它们在扫描html、聚合所有JS和CSS并输出到一个文件方面做得很好。但是,对于我来说,我无法使url重写以正常工作。我的结构很简单:\rootindex.htmlapplication.css//minifiedapplication.js//minified\vendor\bootstrap\fonts//fontfilesherebootstrap.css//pre-minifiedbootstrap.css使用相对url引用字体文件-font/bootstrap_font.ttf当boo

javascript - 将两个图像拖在一起,但将移动限制在垂直轴上

我想在一个页面上将两个图像一起移动。其布局如下:|1.1|--2.1--||1.2|--2.2--||1.3|--2.3--||1.4|--2.4--|因此图像彼此相邻,以“1”开头的单元格属于第一张图像,以“2”开头的单元格属于第二张图像。当我拖动任何图像时,预期的行为是两个图像都移动,但图像1仅在垂直轴上移动。(所以它仍然在左边,但可能会像图片2一样上下移动。这张图片将用作一种标题,需要始终在左侧可见,但需要垂直同步与图像2.),图像2可以沿两个轴移动。在示例中,这意味着第一个图像的1.1部分将始终与第二个图像的2.1部分对齐。有没有可能支持这个的JS框架?我试过使用fabricJ

javascript - 检索或更改伪元素的 css 规则

编辑2015-10-071624CST这个问题已被标记为可能重复-我发布它的原因是其他问题的答案都没有提供我想要的所有信息,我想要一种简单直接的方法来做到这一点。我可以控制样式表和规则的顺序,以便引用正确的规则。我还想就这种方法的可行性得到反馈,因为它在future会被打破。查看我在下面发布的评论,了解我不接受可能重复问题的答案的其他原因。**原始问题如下**我搜索了一个这样的问题,并找到了一些解决问题的一部分,但不能同时检索和更改伪元素的CSS值,如::before和::after.在来这里之前我已经用谷歌搜索了网络,基本上我发现没有理想的方法可以做到这一点。我找到了一种适用于FF4

javascript - 不触发显示 block 和 css 转换的解决方法

对于这个问题的这么多更新,我很抱歉,我很高兴每个人都试图帮助我。我认为下面有一个更清晰的理解这个问题的方法:如果您在更改附加过渡的属性之前立即将元素的显示属性设置为block,则CSS过渡将不适用。考虑以下代码:CSS:#creative{display:none;opacity:0;transition:opacity0.5s;}HTML:SampletextJavascript:vardom={};dom.creative=document.getElementById('creative');dom.creative.style.display='block';dom.creat

javascript - 如何比较用 `.bind()` 调用的两个函数?

我正在我的Socket.IO事件和我的应用程序的其余部分之间构建一个中间件层。我这样做是为了将来可以将Socket.IO换成其他东西。我将回调函数存储在一个数组中。当特定事件触发时,我遍历数组并执行回调函数。这就像一个魅力。问题在于从该数组中删除回调。当需要删除回调函数时,我遍历数组并检查每个数组项以查看它是否等于(使用===)要删除的回调。当回调存储在数组中时,这工作正常。但是,当回调与.bind()组合存储时,相等检查返回false。我创建了一个(简化的)codepen来演示这个问题:http://codepen.io/petergoes/pen/wWPJdg?editors=00